<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="../util/bootstrap-3.3.7-dist/css/bootstrap.css">
		<script src="../util/jquery-3.4.1.js"></script>
		<script src="../util/bootstrap-3.3.7-dist/js/bootstrap.js"></script>
		<link rel="stylesheet" type="text/css" href="../css/depManage.css" />
		<link rel="stylesheet" type="text/css" href="../font/font-awesome-4.7.0/css/font-awesome.min.css" />
		<script type="text/javascript" src="../js/regularExpression.js"></script>
	</head>
	<body>
		<h2 class="h2">部门管理</h2>
		<div class="department-part">
			<span>所有部门</span>
			<div class="add-department">
				<button type="button" class="btn btn-primary btn-md" data-toggle="modal" data-target="#addDepartmentModal" id="addDep"><span
					 class="fa fa-plus-square" style="padding-right: 5px;" ></span>添加部门</button>
			</div>
			<div class="table-responsive department-table">

				<table class="table table-bordered table1">
					<tr style="font-size: 14px; border-bottom:3.5px solid #dee2e6 ;border-top: 2px solid #dee2e6 ;" class="headline">
						<th>编号</th>
						<th>部门</th>
						<th>负责人</th>
						<th>负责人电话</th>
						<th>人数</th>
						<th>详情</th>
						<th>操作</th>
						<th>查看</th>
						</tr>
				</table>
				<nav aria-label="Page navigation">
					<ul class="pagination">
					</ul>
				</nav>
			</div>
		</div>
		<!-- 添加模块 -->
		<div class="modal fade" id="addDepartmentModal" tabindex="-1" role="dialog">
			<div class="modal-dialog" role="document">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
						<h4 class="modal-title" id="myModalLabel">添加新部门</h4>
					</div>
					<div class="modal-body">
						<form class="form-horizontal ">
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-2 control-label">部门名称</label>
								<div class="col-sm-10">
									<input type="text" class="form-control addDepartmentInput" id="name" placeholder="该部门名称">
								</div>
								<span class="col-sm-2"></span>
								<p class="col-sm-10 DepartmentRemind">部门名称长度在3-10字之间!</p>
							</div>
							<div class="form-group">
								<label for="inputPassword3" class="col-sm-2 control-label">负责人</label>
								<div class="col-sm-10">
									<input type="text" class="form-control addDepartmentInput" id="leading" placeholder="负责人名字">
								</div>
								<span class="col-sm-2"></span>
								<p class="col-sm-10 DepartmentRemind">负责人名称长度在2-10字之间！</p>
							</div>
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-2 control-label">负责电话</label>
								<div class="col-sm-10">
									<input type="text" class="form-control addDepartmentInput" id="leadingTel" placeholder="负责人的电话">
								</div>
								<span class="col-sm-2"></span>
								<p class="col-sm-10 DepartmentRemind">请输入正确的手机号码!</p>
							</div>
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-2 control-label">详情</label>
								<div class="col-sm-10">
									<input type="text" class="form-control addDepartmentInput" id="about" placeholder="该部门简介">
								</div>
								<span class="col-sm-2"></span>
								<p class="col-sm-10 DepartmentRemind">详情长度在0-50字之间！</p>
							</div>
						</form>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal" >取消</button>
						<button type="button" class="btn btn-primary" id="saveDep">添加</button>
					</div>
				</div>
			</div>
		</div>
		<!-- 编辑模块 -->
		<div class="modal fade" tabindex="-1" role="dialog" id="departmentEdit">
			<div class="modal-dialog" role="document">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span >&times;</span></button>
						<h4 class="modal-title">编辑部门</h4>
					</div>
					<div class="modal-body">
						<form class="form-horizontal">
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-2 control-label" >部门名称</label>
								<div class="col-sm-10">
									<input type="text" class="form-control departmentEditInput" name="name" placeholder="该部门名称" autocomplete="off">
								</div>
								<span class="col-sm-2"></span>
								<p class="col-sm-10 DepartmentRemind">部门名称长度在3-10字之间!</p>
							</div>
							<div class="form-group">
								<label for="inputPassword3" class="col-sm-2 control-label " >负责人</label>
								<div class="col-sm-10">
									<input type="text" class="form-control departmentEditInput" name="leading" placeholder="负责人名字" autocomplete="off">
								</div>
								<span class="col-sm-2"></span>
								<p class="col-sm-10 DepartmentRemind">负责人名称长度在2-10字之间！</p>
							</div>
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-2 control-label" >负责电话</label>
								<div class="col-sm-10">
									<input type="text" class="form-control departmentEditInput" name="leadingTel" placeholder="负责人的电话" autocomplete="off">
								</div>
								<span class="col-sm-2"></span>
								<p class="col-sm-10 DepartmentRemind"></p>
							</div>
							<div class="form-group">
								<label for="inputEmail3" class="col-sm-2 control-label" >详情</label>
								<div class="col-sm-10">
									<input type="text" class="form-control departmentEditInput " name="about" placeholder="该部门简介" autocomplete="off">
								</div>
								<span class="col-sm-2"></span>
								<p class="col-sm-10 DepartmentRemind">详情长度在0-50字之间！</p>
							</div>
						</form>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
						<button type="button" class="btn btn-primary" id="saveEdit">保存</button>
					</div>
				</div><!-- /.modal-content -->
			</div><!-- /.modal-dialog -->
		</div><!-- /.modal -->
		<!-- 删除模块 -->
		<div class="modal fade" tabindex="-1" role="dialog" id="departmentDelete">
			<div class="modal-dialog" role="document">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" ><span >&times;</span></button>
						<h4 class="modal-title">删除部门</h4>
					</div>
					<div class="modal-body">
						<p>确定删除该部门？</p>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
						<button type="button" class="btn btn-primary" id="deletesResure">确定</button>
					</div>
				</div><!-- /.modal-content -->
			</div><!-- /.modal-dialog -->
		</div><!-- /.modal -->
		<!-- 查看人员模块 -->
		<div class="modal fade" tabindex="-1" role="dialog" id="DepartmentCheck">
			<div class="modal-dialog" role="document">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" ><span >&times;</span></button>
						<h4 class="modal-title">查看人员</h4>
					</div>
					<div class="modal-body checkbody">
						<div class="table-responsive department-table2">
							<table class="table table-bordered table2">
								<tr style="font-size: 14px; border-bottom:3.5px solid #dee2e6 ;border-top: 2px solid #dee2e6 ;" class="headline">
									<th>姓名</th>
									<th>性别</th>
									<th>职位</th>
									<th>手机号码</th>
									<th>生日</th>
									</tr>
							</table>
					</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					</div>
				</div><!-- /.modal-content -->
			</div><!-- /.modal-dialog -->
		</div><!-- /.modal -->
	</body>
    <script type="text/javascript" src="../js/depManage.js"></script>
	
</html>
